<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="images/favicon.ico">

    <title>同昌官网</title>
    <!-- Bootstrap core CSS -->
    <link href="js/bootstrap-3.3.7/css/bootstrap.min.css" rel="stylesheet">

    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <link href="js/bootstrap-3.3.7/css/ie10-viewport-bug-workaround.css" rel="stylesheet">
    <link href="js/bootstrapValidator/bootstrapValidator.css" rel="stylesheet">

    <!-- custom style-->

    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="plugs/animate/animate.min.css">
    <link rel="stylesheet" href="plugs/swiper/swiper.min.css">
    <link rel="stylesheet" href="css/dxwx/dxwx.css">


    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
    <!--[if lt IE 9]>
    <script src="js/bootstrap-3.3.7/js/ie8-responsive-file-warning.js"></script><![endif]-->
    <script src="js/bootstrap-3.3.7/js/ie-emulation-modes-warning.js"></script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="js/bootstrap-3.3.7/js/html5shiv.min.js"></script>
    <script src="js/bootstrap-3.3.7/js/respond.min.js"></script>
    <![endif]-->
	<style>
        .slideImg img{width:100%;height:auto;}
    </style>

</head>
<body oncontextmenu=self.event.returnValue=false onselectstart="return false">
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
    <div class="modal-dialog" style="width:410px;">
        <div class="modal-content" style="width:410px;">
            <div class="modal-body">
                <form class="form-signin" id="loginForm">
                    <div class="header row">
                        <div class="col-xs-4"><span></span></div>
                        <div class="col-xs-4 ">网站登录</div>
                        <div class="col-xs-4"><span></span></div>
                    </div>
                    <div class="form-group">
                        <span class="userLabel">用户名 <i></i></span>
                        <input type="text" class="form-control" name="username" id="userName" required autofocus
                               placeholder="请输入用户名"/>
                    </div>
                    <div class="form-group">
                        <span class="passwordLabel">密码 <i></i></span>
                        <input type="password" class="form-control" name="password" id="password" required
                               placeholder="请输入密码"/>
                    </div>
                    <div class="form-group">
                        <button type="submit" id="submitBtn" class="btn btn-lg btn-primary btn-block">登录</button>
                    </div>
                </form>

            </div>
        </div>
    </div>
</div>
<div class="navbar-wrapper">
    <div class="container">
        <nav class="navbar  navbar-static-top">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
                            aria-expanded="false" aria-controls="navbar">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="index.html">
                        <img alt="Brand" src="images/common/logo.png">
                    </a>
                </div>
                <div id="navbar" class="navbar-collapse collapse">
                    <ul class="nav navbar-nav">
                        <li><a href="dqtc.html">大气天成</a></li>
                        <li><a href="djff.html">大将风范</a></li>
                        <li class="active"><a href="#">大象无形</a></li>
                        <li><a href="dcwo.html">大成无偶</a></li>
                        <li><a href="dawj.html">大爱无疆</a></li>
                        <li><a href="dyht.html">大业宏图</a></li>
                        <ul class="nav navbar-nav pull-right">
                            <li class="loginBtn" data-toggle="modal" data-target="#myModal">登录</li>
                            <!--<li><a href="#">注册</a></li>-->
                            <li><a href="#" class="line"></a></li>
                            <!--<li><a href="#" class="searchIcon"></a></li>-->
                            <li class="wxBox"><a href="javascript:void(0);" class="weixin"></a><a
                                    href="javascript:void(0);" class="jtewm"></a></li>
                            <!--<li><a href="#" class="en"></a></li>-->
                        </ul>
                    </ul>
                </div>
            </div>
        </nav>

    </div>
</div>
<section class="item dxwx">
    <div class="dxwxContent">
        <div class="dxwxBg"></div>
        <div class="dxwxText">
            <div class="textInner">
                <div class="container">
                    <div class="textContent">
                        <div class="dxwxTextTitle">
                            <span>大</span><span>象</span><span>无</span><span>形</span>
                        </div>
                        <div class="dxwxSubtitle wow  rubberBand animated">一幅志存高远、壮阔无疆的魅力蓝图</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<section class="item spirit wow fadeInUp animated" style="visibility: visible; animation-name: fadeInUp;">
    <div class="container ">
        <div class="row spiritHeader">
            <div class="col-xs-12 ">
                <div class="row">
                    <div class="col-xs-4">
                        <div class="line"></div>
                    </div>
                    <div class="col-xs-4 ">
                        <div class="itemTitle">同昌力量</div>
                        <small class="itemTitleEn">The enterprise culture</small>
                    </div>
                    <div class="col-xs-4 ">
                        <div class="line"></div>
                    </div>
                </div>

            </div>
        </div>
        <div class="row spiritContent">
            <canvas width="1200" height="520" id="myCanvas" class="wow wow fadeInUp animated"></canvas>
            <div id="tags">
                <a href="#">企业精神</a>
                <a href="#">董事局主席韩建明先生</a><a href="#"></a><a href="#"> “同创同享，与社会同昌”</a><a
                    href="#">坚持“致力于技术领先，成功于客户满意”</a>
                <a href="#">基于市场需求持续创新</a><a href="#">科技引领、产业协同</a><a href="#">传承“诚信、感恩、忠诚、责任”</a><a href="#">政法、教育、医疗、交通、环保</a><a
                    href="#">打造百年同昌</a>
                <a href="#">推动互联网更好地造福人类</a><a href="#">历史使命</a><a href="#">企业管理模式</a><a href="#">始终坚持</a>
                <a href="#">企业经营理念</a><a href="#">开放包容、合作共享、凝聚共识、融合发展</a>
            </div>
        </div>
    </div>
</section>
<section class="item news wow fadeInUp animated" style="visibility: visible; animation-name: fadeInUp;">
    <div class="shadow">
        <a href="javascript:void(0)" class="dxwx_close"><img src="images/dxwx/close_shadow.png" alt=""></a>
        <div class="cont_video">

        </div>
    </div>
    <div class="container">
        <div class="row newsHeader">
            <div class="col-xs-12 ">
                <div class="row">
                    <div class="col-xs-4">
                        <div class="line"></div>
                    </div>
                    <div class="col-xs-4">
                        <div class="itemTitle">精彩同昌</div>
                        <small class="itemTitleEn">Industry news
                        </small>
                    </div>
                    <div class="col-xs-4 ">
                        <div class="line "></div>
                    </div>
                </div>

            </div>
        </div>
        <div class="row newsContent wow fadeInUp animated" style="visibility: visible; animation-name: fadeInUp;">
            <div class="col-sm-6">
                <div class="videoBox newsItem wow animated fadeInLeftBig ">
                    <div class="videoBg">
                        <div class="moreVideo"></div>
                        <div class="videoInner" id="newsVideoBox">
                            <div class="videoStart"></div>
                            <div class="videoText">
                                <div class="videoTitle">热烈祝贺同昌商学院挂牌暨新华三大学培训认证中心授牌仪式</div>
                                <div class="videoTime">2018-10-08</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="goodHeadlines newsItem  wow animated fadeInRightBig ">
                    <div class="title">精彩头条</div>
                    <div class="subTitle">
                        <div class="subTitleEn item">Good headlines</div>
                        <!--<div class="moreNews item"><a href="#">更多内容</a></div>-->
                    </div>
                    <ul class="newsList">
                        <li videoSrc="video_01.mp4" videoTitme="">
                            <a href="javascript:void(0)">全省企业家大会在太原召开，省委书记骆惠宁出席并讲话</a>
                            <div class="newsText">
                                <!--<small class="time">7小时前</small>-->
                                <small class="count">245阅读</small>
                            </div>

                        </li>
                        <li videoSrc="video_02.mp4" videoTitme=""><a href="javascript:void(0)">热烈祝贺同昌商学院挂牌暨新华三大学培训认证中心授牌仪式圆满成功！！！</a>
                            <div class="newsText">
                                <!--<small class="time">7小时前</small>-->
                                <small class="count">245阅读</small>
                            </div>

                        </li>
                        <li videoSrc="video_03.mp4" videoTitme=""><a href="javascript:void(0)">聆听政府报告 共促社会发展</a>
                            <div class="newsText">
                                <!--<small class="time">7小时前</small>-->
                                <small class="count">245阅读</small>
                            </div>
                        </li>
                        <li videoSrc="video_04.webm" videoTitme=""><a href="javascript:void(0)">聚力携手新时代 奋力谱写新篇章</a>
                            <div class="newsText">
                                <!--<small class="time">7小时前</small>-->
                                <small class="count">245阅读</small>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="row" style="padding:0;margin:0;">
            <div>
                <div class="newSlide">
                    <div class="swiper-father">
                        <div class="swiper-container" id="newSlideSwiper">
                            <div class="swiper-wrapper">

                                <div class="swiper-slide slide1">
                                    <a href="http://dangjian.com/djw2016sy/djw2016gddj/201812/t20181210_4929969.shtml">


                                    </a>
                                </div>

                                <div class="swiper-slide slide2">
                                    <a href="http://www.js.xinhuanet.com/2018-12/10/c_1123831136.htm">
                                        <!--<img src="images/dxwx/slide02.png" alt="">-->

                                    </a>
                                </div>
                                <div class="swiper-slide slide3">
                                    <a href="http://sh.qihoo.com/pc/96b668e1c4be0ec98?cota=1&sign=360_e39369d1&refer_scene=so_3">
                                        <!--<img src="images/dxwx/slide03.png" alt="">-->

                                    </a>
                                </div>
                                <div class="swiper-slide slide4 ">
                                    <a href="http://news.qz828.com/system/2018/12/10/011500713.shtml">
                                        <!--<img src="images/dxwx/slide04.png" alt="">-->
                                    </a>

                                </div>
                                <div class="swiper-slide slide5">
                                    <a href="https://www.toutiao.com/a6632847820766331405/">
                                        <!--<img src="images/dxwx/slide05.png" alt="">-->
                                    </a>
                                </div>
                            </div>
                        </div>
                        <div class="swiper-button-prev"></div>
                        <div class="swiper-button-next"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<section class="item paper wow fadeInUp animated" style="visibility: visible; animation-name: fadeInUp;overflow:hidden;height:1100px">
    <div class="container">
        <div class="row paperHeader">
            <div class="col-xs-12 ">
                <div class="row">
                    <div class="col-xs-4">
                        <div class="line"></div>
                    </div>
                    <div class="col-xs-4">
                        <div class="itemTitle">同昌微报</div>
                        <small class="itemTitleEn">E-paper
                        </small>
                    </div>
                    <div class="col-xs-4 ">
                        <div class="line"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
	<div style="height:auto;">
    <div style="position:relative;height:800px;width:100%;">
        <div id="canvas" >
            <!-- 右上角放大缩小按钮 -->
            <div class="zoom-icon zoom-icon-in"></div>
            <div class="magazine-viewport" style="width:100%;">
                <div class="container">
                    <div class="magazine"  ></div>
                </div>
                <!-- Next button -->
                <div ignore="1" class="next-button"></div>

                <!-- Previous button -->
                <div ignore="1" class="previous-button"></div>
            </div>
        </div>
    </div>
	</div>
</section>
<section class="item article wow fadeInUp animated" style="visibility: visible; animation-name: fadeInUp;">
    <div class="container">
        <div class="row articleHeader">
            <div class="col-xs-12 ">
                <div class="row">
                    <div class="col-xs-4">
                        <div class="line"></div>
                    </div>
                    <div class="col-xs-4">
                        <div class="itemTitle">同昌美文</div>
                        <small class="itemTitleEn">Wechat tweets
                        </small>
                    </div>
                    <div class="col-xs-4 ">
                        <div class="line "></div>
                    </div>
                </div>
            </div>
        </div>
       <div class="articleContent row">
            <div class="swiper-father">
                <div class="swiper-container" id="articleSwiper">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <a href="https://mp.weixin.qq.com/s?__biz=MzI2MjAwMDQ4NQ==&mid=2649531975&idx=1&sn=8b3b6bb9cdbd62d9b56dcb93b6a64233&chksm=f249dc4dc53e555b73a580c752b6b388d700c262b3e586e41c8d5079d9909afbd9343bfc6889&token=1087206507&lang=zh_CN#rd">
                                <div class="articleItem">
                                    <div class="slideImg">
                                        <img src="images/dxwx/article01.png" alt="">
                                    </div>
                                    <div class="articleTitle">成就梦想·扬帆远航--你想要的，这里都有！</div>
                                    <div class="articleText">
                                        中科同昌商学院特别推出短期速成班，只要2天！就能完成H3CNA认证课程，成为H3C认证助理网络工程师；只要5天！！就能完成新华三大学的H3CNE课程，成为H3C认证网络工程师；只要15天！！！就能完成H3CSE认证课程，成为H3C认证高级网络工程师......更多课程来电详询，你想要的这里都有，走过路过不要错过，名额有限！速来询价!
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a href="https://mp.weixin.qq.com/s?__biz=MzI2MjAwMDQ4NQ==&mid=2649532012&idx=1&sn=b4f7c63dc9371525ef0ff0d284fa91c5&chksm=f249dc66c53e5570ffec77cb8020edd3262ae3933d436e56caa4393d2b10dcd839324faac480&token=1087206507&lang=zh_CN#rd">
                                <div class="articleItem">
                                    <div class="slideImg">
                                        <img src="images/dxwx/article02.png" alt="">
                                    </div>
                                    <div class="articleTitle">全“程”优惠倒计时！！！</div>
                                    <div class="articleText">
                                        各地市长期奋斗在第一线的新老客户们！

                                        因工作繁忙而没有时间提升自己的小伙伴们！！

                                        即将步入社会，对未来充满迷茫的小哥哥/小姐姐们！！！

                                        看过上期文章还在犹豫的客户们！！！

                                        注意啦~~~~

                                        我们的一周年优惠期开始倒计时啦啦啦啦~~~~

                                        心动不如行动，赶快拨打电话报名吧！                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a href="https://mp.weixin.qq.com/s?__biz=MzI2MjAwMDQ4NQ==&mid=2649532017&idx=1&sn=1e89dba52f9a9106313ebb1b3133d27d&chksm=f249dc7bc53e556dd5ea1de3fef6918d22164b1feb1384222abad0e3dd49e5bebb65c53e88fb&token=1087206507&lang=zh_CN#rd">
                                <div class="articleItem">
                                    <div class="slideImg">
                                        <img src="images/dxwx/article03.png" alt="">
                                    </div>
                                    <div class="articleTitle">1111惊爆来袭！！！</div>
                                    <div class="articleText">
                                        同昌商学院现已开设H3C所有认证课程，同时还开设安全运维、渗透测试、网络攻防、移动安全等多个网络安全专项课程，为客户量身定制培训模式，充分满足全国不同类型、不同个体等多层次的需求，不仅为每一位学员提供技术技能类的课程学习，还会与每一位学员分享成功经验、岗前心理辅导等等。


                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a href="https://mp.weixin.qq.com/s?__biz=MzAxNzYxMzk0Mw%3D%3D&mid=2457287576&idx=1&sn=ba500154a478a234a9cb12f758ad0bfb&scene=45#wechat_redirect">
                                <div class="articleItem">
                                    <div class="slideImg">
                                        <img src="images/dxwx/article04.png" alt="">
                                    </div>
                                    <div class="articleTitle">【企服大咖专访】耿焕苹 | IT世界，她所赋予代码的37℃热度</div>
                                    <div class="articleText">
                                        干练精致的80后、亲和明媚的感染力、事业有成的集团总裁，而且还担负着诸多社会身份，仅凭想象，你怎么也不会把这样一个原本可以靠颜值担当的偶像派，定位在科技领域中的实力干将。认识她你会发现，有的时候丰满的理想，也配得上超豪华阵容的现实。
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a href="https://mp.weixin.qq.com/s?__biz=MzI2MjAwMDQ4NQ==&mid=2649532028&idx=1&sn=3e566f13402cedd8c2937ed8777a2b83&chksm=f249dc76c53e5560ae43d3f8909d74593fd56e96e039b87b9f0526723b04a2cd3613c7c2f4a9&token=1087206507&lang=zh_CN#rd">
                                <div class="articleItem">
                                    <div class="slideImg">
                                        <img src="images/dxwx/article05.png" alt="">
                                    </div>
                                    <div class="articleTitle">携手同昌·赋能未来</div>
                                    <div class="articleText">
                                        昨日下午，中科同昌信息技术集团有限公司与联通（山西）产业互联网有限公司签署战略合作协议！中科同昌集团董事局主席韩建明先生、总裁耿焕苹女士、大数据公司高管代表、联通（山西）产业互联网有限公司总经理李艺先生及高管代表共同见证并进行了签约仪式。
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a href="https://mp.weixin.qq.com/s?__biz=MzI2MjAwMDQ4NQ==&mid=2649532048&idx=1&sn=46798201dafec9c3d13b62c8b8de0ae2&chksm=f249dc9ac53e558c6a61d59d6a849731a8cb630bc2b05620ea600d16c2d169ee3045ae86fc07&token=1087206507&lang=zh_CN#rd">
                                <div class="articleItem">
                                    <div class="slideImg">
                                        <img src="images/dxwx/article06.png" alt="">
                                    </div>
                                    <div class="articleTitle">中科同昌集团全新网站，震撼上线！！</div>
                                    <div class="articleText">
                                        同昌网站是中科同昌集团对外展示实力与能力的重要窗口之一，更是展现同昌风采的重要渠道之一，为了能够更好地将同昌特色及饱满的精神气质形象地展示出去，中科同昌集团于2018年6月底开始策划网站全新改版活动。
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="swiper-slide">
                            <a href="https://mp.weixin.qq.com/s?__biz=MzI2MjAwMDQ4NQ==&mid=2649532054&idx=1&sn=571c3ea65018877b22e6450b8c4bb436&chksm=f249dc9cc53e558aa98fb63c961211ada7f5fdd33304b70eb153005b52c2ef6da235986a8a37&token=1087206507&lang=zh_CN#rd">
                                <div class="articleItem">
                                    <div class="slideImg">
                                        <img src="images/dxwx/article07.png" alt="">
                                    </div>
                                    <div class="articleTitle">感恩季，优惠来袭，你参加了么？</div>
                                    <div class="articleText">
                                        我曾以为父母的爱情，与我看到他们现在的生活一样，柴米油盐，平平淡淡，最有激情的时候大概也就是一起训我的时候吧。

                                        很多人可能都和我一样，习惯了父母之间亲情的相处方式，很难去想象年轻的爸妈的爱情，直到我找到了一张年代久远的老照片，听妈妈说起了照片的故事……
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>
            </div>
            <!-- <a class="moreArticle"> </a>-->
        </div>
    </div>
</section>
<footer class="footer wow fadeInUp animated" style="visibility: visible; animation-name: fadeInUp;">
    <div class="container">
        <div class="row">
            <div class="col-xs-12">
                <div class="footTitle"><img src="images/common/footerLogo.png" alt=""></div>
            </div>
        </div>
        <div class="row footContent">
            <div class="col-xs-12 col-sm-7">
                <div class="row">
                    <div class="col-xs-3">
                        <div class="footItems">关于我们</div>
                        <div class="footItem">
                            <a href="javascript:void(0)">关于同昌</a>
                            <a href="javascript:void(0)">发展历程</a>
                        </div>
                    </div>
                    <div class="col-xs-3">
                        <div class="footItems">加入我们</div>
                        <div class="footItem">
                            <a href="javascript:void(0)">社会招聘</a>
                            <a href="javascript:void(0)">校园招聘</a>
                        </div>
                    </div>
                    <div class="col-xs-3">
                        <div class="footItems">联系我们</div>
                        <div class="footItem">
                            <a href="javascript:void(0)">客户服务</a>
                            <a href="javascript:void(0)">合作洽谈</a>
                        </div>
                    </div>
                    <div class="col-xs-3">
                        <div class="footItems">服务热线</div>
                        <div class="footItem">
                            <a href="javascript:void(0)">400-653-0677</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-xs-12 col-sm-5 line">
                <div class="row">
                    <div class="col-xs-6  col-sm-5  col-sm-offset-1">
                        <div class="ewm">民生之钥</div>
                        <img src="images/common/mszy.png" alt=""></div>
                    <div class="col-xs-6 col-sm-5">
                        <div class="ewm">关注同昌</div>
                        <img src="images/common/jt.png" alt="">
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12">
                <div class="segmenLine"></div>
            </div>
        </div>
        <div class="row ">
            <div class="col-xs-12 footText">
                <div>法律声明 | 监督举报 | 网站地图 | 晋网文【2018】6138-1456号</div>
                <div>Copyright 1996 - 2018 Topchance. All Rights Reserved.中科同昌信息技术集团</div>
            </div>
        </div>
    </div>
</footer>
<div class="newsAlert">
    <div class="dialogNewsAlert"></div>
</div>
<!--回到顶部-->
<div id="jumpTop"></div>
<script src="js/jquery-v1.12.4/jquery.min.js"></script>
<!--vendor-->
<script>window.jQuery || document.write('<script src="js/bootstrap-3.3.7/js/jquery.min.js"><\/script>')</script>
<script src="js/bootstrapValidator/bootstrapValidator.min.js"></script>
<script src="js/bootstrap-3.3.7/js/bootstrap.min.js"></script>
<script src="js/bootstrapValidator/zh_CN.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="js/bootstrap-3.3.7/js/ie10-viewport-bug-workaround.js"></script>
<script src="plugs/wow/wow.min.js"></script>
<!--翻书效果开始-->
<link href="css/magazine.css" rel="stylesheet" type="text/css">
<!--<script type="text/javascript" src="js/jquery.min.1.7.js"></script>-->
<script type="text/javascript" src="js/modernizr.2.5.3.min.js"></script>
<script type="text/javascript" src="js/hash.js"></script>
<script type="text/javascript" src="js/turn.js"></script>
<script type="text/javascript" src="js/turn.html4.min.js"></script>
<script type="text/javascript" src="js/zoom.min.js"></script>
<script type="text/javascript" src="js/magazine.js"></script>
<!--翻书效果结束-->
<!--同昌力量开始-->
<script src="js/dxwx/tagcanvas.min.js"></script>
<!--同昌力量结束-->
<script src="js/common.js"></script>
<script src="plugs/wow/wow.min.js"></script>
<script src="plugs/swiper/swiper.min.js"></script>
<script src="plugs/layer/layer.js"></script><!--layer JS-->
<link rel="stylesheet" href="plugs/sweetalert2/sweetalert2.min.css">
<script src="plugs/sweetalert2/sweetalert2.all.min.js"></script>


<script>
    new WOW().init(); //初始化加载
    $(document).ready(function () {
        $(window).scroll(function () {
            if ($(window).scrollTop() > 300) {
                $('#jumpTop').fadeIn(800);
            } else {
                $('#jumpTop').fadeOut(800);
            }
        });
        $("#jumpTop").click(function () {
            $('body,html').animate({
                    scrollTop: 0
                },
                1000);
            return false;
        });
        var username = window.sessionStorage.username;//获取绘话中的用户名
        if (username) {
            $(".loginBtn").html(username);
            $(".loginBtn").css({"color":"#fff"});
            $(".loginBtn").attr("data-target","");
        } else {
            $(".loginBtn").html('登录');
            $(".loginBtn").attr("data-target","#myModal");
        }
        //防下载
        document.onkeydown = function () {
            var e = window.event || arguments[0];
            //屏蔽F12
            if (e.keyCode == 123) {
                return false;
                //屏蔽Ctrl+Shift+I
            } else if ((e.ctrlKey) && (e.shiftKey) && (e.keyCode == 73)) {
                return false;
				
                //屏蔽Shift+F10
            } else if ((e.shiftKey) && (e.keyCode == 121)) {
                return false;

            } else if (event.ctrlKey && window.event.keyCode == 83) {
                return false;
            }
        };
        //屏蔽右键单击
        document.oncontextmenu = function () {
            return false;
        }

        //文字滚动标签效果 同昌之力
        try {
            var i, et = document.getElementById('tags').childNodes;
            for (i in et) {
                et[i].nodeName == 'A' && et[i].addEventListener('click', function (e) {
                    e.preventDefault();
                });
            }
            TagCanvas.Start('myCanvas', 'tags', {
                textColour: '#fff',
                outlineColour: '#fff',
                padding: 200,
                reverse: true,
                depth: 0.8,
                noMouse: true,
                dragControl: false,
                decel: 0.95,
                maxSpeed: 0.05,
                initial: [-0.2, 0],
                textAlign: "center",
                textHeight: 18,
                outlineMethod: "size",
                outlineOffset: '30',


            });
        } catch (e) {
        }

    });

    $(function () {
        var dxwxBg = $(".dxwxBg"); //背景图片容器
        var dxwxTextTitle = $(".dxwxTextTitle");//文字容器
        loadTextOpacity(dxwxTextTitle);
        $(document).mousemove(function (e) {
            //背景图片移动
            getMousePos(e, dxwxBg);
        });
        // modal  居中显示
        var $m_btn = $('.loginBtn');
        var $modal = $('#myModal');

        $modal.on('show.bs.modal', function () {
            var $this = $(this);
            var $modal_dialog = $this.find('.modal-dialog');
            // 关键代码，如没将modal设置为 block，则$modala_dialog.height() 为零
            $this.css('display', 'block');
            $modal_dialog.css({'margin-top': Math.max(0, ($(window).height() - $modal_dialog.height()) / 2)});
        });
        $('#myModal').on('shown.bs.modal', function () {
            $("#loginForm").bootstrapValidator({
                live: 'enabled',//验证时机，enabled是内容有变化就验证（默认），disabled和submitted是提交再验证
                excluded: [':disabled', ':hidden', ':not(:visible)'],//排除无需验证的控件，比如被禁用的或者被隐藏的
                submitButtons: '#submitBtn',//指定提交按钮，如果验证失败则变成disabled，但我没试成功，反而加了这句话非submit按钮也会提交到action指定页面
                message: '通用的验证失败消息',//好像从来没出现过
                feedbackIcons: {//根据验证结果显示的各种图标
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    username: {
                        message: '用户名验证失败',
                        validators: {
                            notEmpty: {
                                message: '用户名不能为空'
                            }
                        }
                    },
                    password: {
                        validators: {
                            /* regexp: {//正则验证
                                 regexp: /^[a-zA-Z0-9_\.]+$/,
                                 message: '所输入的字符不符要求'
                             },*/
                            notEmpty: {
                                message: '密码不能为空'
                            }
                        }
                    },
                }
            });
            $("#submitBtn").click(function (e) {
                e.preventDefault();
                $("#loginForm").bootstrapValidator('validate');//提交验证
                if ($("#loginForm").data('bootstrapValidator').isValid()) {
                    var username = $.trim($("#userName").val());
                    var password = $.trim($("#password").val());
                    $.ajax({
                        url: "http://192.168.100.25:2255/eye/a/tcoa/login/manage",
                        type: "post",
                        data: {username: username, password: password},
                        success: function (data) {
                            if (data) {
                                data = JSON.stringify(data);
                                data = JSON.parse(data);
                                if (data.loginmark == 1) {
                                    $('#myModal').modal('hide');
                                    swal(
                                        '恭喜登录成功！',
                                    );


                                    // sessionStorage.useId = data.id;
                                    // alert(id);//保存用户名id
                                    sessionStorage.username = data.username;    //保存用户名
                                    //  alert()
                                      $(".loginBtn").html(data.username);
                                    $(".loginBtn").attr("data-target"," ");
                                    $(".loginBtn").css({"color":"#fff"});
                                }
                                if (data.loginmark == 2) {
                                    swal({
                                        title: '用户名或密码填写错误登录失败!',
                                        type: 'error',
                                        confirmButtonColor: '#3085d6',
                                        cancelButtonColor: '#d33',
                                        confirmButtonText: '确定',
                                        confirmButtonClass: 'btn btn-success',
                                        buttonsStyling: false ,

                                    }).then(function () {
                                        swal(
                                            '请重新核对填写信息',
                                             'info'
                                        )
                                    });
                                    //layer.alert('用户名或密码填写错误', {icon: 2});
                                    $("#loginForm").data("bootstrapValidator").destroy();
                                    $('#loginForm').data('bootstrapValidator', null);
                                    $("#loginForm")[0].reset();
                                }
                            }
                        },
                        error: function (xhr, data) {
                            swal('发送ajax失败');
                        },
                        complete: function () {
                            $("#loginForm").data("bootstrapValidator").destroy();
                            $('#loginForm').data('bootstrapValidator', null);
                            $("#loginForm")[0].reset();
                        }
                    })
                }
            });
        });
        //同昌美文
        var mySwiper = new Swiper('#articleSwiper', {
            slidesPerView: 3,
            spaceBetween: 30,
            loop: true, // 循环模式选项
            pagination: {
                el: '.swiper-pagination',
                clickable: true,
            },
            // 如果需要前进后退按钮
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },
        });
        //精彩同昌   图片滚动
        var newSlideSwiper = new Swiper('#newSlideSwiper', {
            slidesPerView: 4,
            spaceBetween: 30,
            loop: true, // 循环模式选项
            // 如果需要前进后退按钮
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },
        });
        // 精彩同昌  新闻    newsList
        $(".news .newsList").find("li").click(function (e) {
            var temp = "";
            var src = $(this).attr("videoSrc");
            temp += '<video controls autoplay width="100%" height="100%">';
            temp += '<source src="video/dxwx/' + src + '" type="video/webm" >';
            temp += '</video>';
            $(".shadow").show();
            $(".cont_video").html("");
            $(".cont_video").append(temp);

        });


        $(".shadow").on("click", ".dxwx_close", function () {
            $(".shadow").hide();
            $(".cont_video").html("");
        })

        $("#newsVideoBox .videoStart").click(function () {
            var temp = '';
            temp += '<video controls autoplay width="100%" height="100%">';
            temp += '<source src="video/dxwx/video_02.mp4" type="video/webm" >';
            temp += '</video>';
            $(".shadow").show();
            $(".cont_video").html("");
            $(".cont_video").append(temp);
        });


        var next_button = $(".next-button");              //初始化左右箭头

        var previous_button = $(".previous-button");

        setArrows();


        

    });

    function loadApp() {

        $('#canvas').fadeIn(1000);

        var flipbook = $('.magazine');

        // Check if the CSS was already loaded

        if (flipbook.width() == 0 || flipbook.height() == 0) {

            setTimeout(loadApp, 10);

            return;

        }

        // 创建flipbook

        flipbook.turn({
            width: 1200,
            height: 600,

            duration: 1000,   //翻页速度，值越小越快

            // Hardware acceleration

            acceleration: !isChrome(),

            // Enables gradients

            gradients: true,

            // Auto center this flipbook

            autoCenter: true,

            // Elevation from the edge of the flipbook when turning a page

            elevation: 50,

            // The number of pages

            pages: 31,      //页数

            // Events

            when: {

                turning: function (event, page, view) {

                    var book = $(this),

                        currentPage = book.turn('page'),

                        pages = book.turn('pages');

                    // Update the current URI

                    Hash.go('page/' + page).update();

                    // Show and hide navigation buttons

                    disableControls(page);

                },

                turned: function (event, page, view) {

                    disableControls(page);

                    $(this).turn('center');

                    if (page == 1) {

                        $(this).turn('peel', 'br');

                    }

                },

                missing: function (event, pages) {

                    // Add pages that aren't in the magazine

                    for (var i = 0; i < pages.length; i++)

                        addPage(pages[i], $(this));

                }

            }

        });


        // Zoom.js

        $('.magazine-viewport').zoom({

            flipbook: $('.magazine'),

            max: function () {

                return largeMagazineWidth() / $('.magazine').width();

            },

            when: {

                swipeLeft: function () {

                    $(this).zoom('flipbook').turn('next');

                },

                swipeRight: function () {

                    $(this).zoom('flipbook').turn('previous');

                },


                resize: function (event, scale, page, pageElement) {

                    if (scale == 1)

                        loadSmallPage(page, pageElement);

                    else

                        loadLargePage(page, pageElement);

                },

                zoomIn: function () {

                    $('.made').hide();

                    $('.magazine').removeClass('animated').addClass('zoom-in');

                    $('.zoom-icon').removeClass('zoom-icon-in').addClass('zoom-icon-out');

                    if (!window.escTip && !$.isTouch) {

                        escTip = true;

                        $('<div />', {'class': 'exit-message'}).html('<div>Press ESC to exit</div>').appendTo($('body')).delay(2000).animate({opacity: 0}, 500, function () {

                            $(this).remove();

                        });

                    }

                },

                zoomOut: function () {

                    $('.exit-message').hide();

                    $('.thumbnails').fadeIn();

                    $('.made').fadeIn();

                    $('.zoom-icon').removeClass('zoom-icon-out').addClass('zoom-icon-in');

                    setTimeout(function () {

                        $('.magazine').addClass('animated').removeClass('zoom-in');

                        resizeViewport();

                    }, 0);

                }

            }

        });


        // Zoom event

        if ($.isTouch)

            $('.magazine-viewport').bind('zoom.doubleTap', zoomTo);

        else

            $('.magazine-viewport').bind('zoom.tap', zoomTo);

        // Using arrow keys to turn the page

        $(document).keydown(function (e) {

            var previous = 37, next = 39, esc = 27;

            switch (e.keyCode) {

                case previous:

                    // left arrow

                    $('.magazine').turn('previous');

                    e.preventDefault();

                    break;

                case next:

                    //right arrow

                    $('.magazine').turn('next');

                    e.preventDefault();

                    break;

                case esc:

                    $('.magazine-viewport').zoom('zoomOut');

                    e.preventDefault();

                    break;

            }

        });


        // URIs - Format #/page/1

        Hash.on('^page\/([0-9]*)$', {

            yep: function (path, parts) {

                var page = parts[1];

                if (page !== undefined) {

                    if ($('.magazine').turn('is'))

                        $('.magazine').turn('page', page);

                }

            },

            nop: function (path) {

                if ($('.magazine').turn('is'))

                    $('.magazine').turn('page', 1);

            }

        });

        $(window).resize(function () {

            resizeViewport();

        }).bind('orientationchange', function () {

            resizeViewport();

        });


        // Events for thumbnails

        $('.thumbnails').click(function (event) {

            var page;

            if (event.target && (page = /page-([0-9]+)/.exec($(event.target).attr('class')))) {

                $('.magazine').turn('page', page[1]);

            }

        });

        $('.thumbnails li').bind($.mouseEvents.over, function () {

            $(this).addClass('thumb-hover');


        }).bind($.mouseEvents.out, function () {


            $(this).removeClass('thumb-hover');


        });


        if ($.isTouch) {

            $('.thumbnails').addClass('thumbanils-touch').bind($.mouseEvents.move, function (event) {

                event.preventDefault();

            });

        } else {

            $('.thumbnails ul').mouseover(function () {

                $('.thumbnails').addClass('thumbnails-hover');

            }).mousedown(function () {

                return false;

            }).mouseout(function () {

                $('.thumbnails').removeClass('thumbnails-hover');

            });

        }


        // Regions

        if ($.isTouch) {

            $('.magazine').bind('touchstart', regionClick);

        } else {

            $('.magazine').click(regionClick);

        }


        // Events for the next button

        $('.next-button').bind($.mouseEvents.over, function () {

            $(this).addClass('next-button-hover');

        }).bind($.mouseEvents.out, function () {

            $(this).removeClass('next-button-hover');

        }).bind($.mouseEvents.down, function () {

            $(this).addClass('next-button-down');

        }).bind($.mouseEvents.up, function () {

            $(this).removeClass('next-button-down');

        }).click(function () {

            $('.magazine').turn('next');

            setTimeout(function () {

                setArrows();

            }, 300);

        });


        // Events for the next button

        $('.previous-button').bind($.mouseEvents.over, function () {

            $(this).addClass('previous-button-hover');

        }).bind($.mouseEvents.out, function () {

            $(this).removeClass('previous-button-hover');

        }).bind($.mouseEvents.down, function () {

            $(this).addClass('previous-button-down');

        }).bind($.mouseEvents.up, function () {

            $(this).removeClass('previous-button-down');

        }).click(function () {

            $('.magazine').turn('previous');

            setTimeout(function () {

                setArrows();

            }, 300);


        });

        resizeViewport();

        $('.magazine').addClass('animated');

    }


    // Zoom icon

    $('.zoom-icon').bind('mouseover', function () {

        if ($(this).hasClass('zoom-icon-in'))

            $(this).addClass('zoom-icon-in-hover');

        if ($(this).hasClass('zoom-icon-out'))

            $(this).addClass('zoom-icon-out-hover');

    }).bind('mouseout', function () {

        if ($(this).hasClass('zoom-icon-in'))

            $(this).removeClass('zoom-icon-in-hover');

        if ($(this).hasClass('zoom-icon-out'))

            $(this).removeClass('zoom-icon-out-hover');

    }).bind('click', function () {

        if ($(this).hasClass('zoom-icon-in'))

            $('.magazine-viewport').zoom('zoomIn');

        else if ($(this).hasClass('zoom-icon-out'))

            $('.magazine-viewport').zoom('zoomOut');

    });

    $('#canvas').hide();
    // Load the HTML4 version if there's not CSS transform

    yepnope({

        test: Modernizr.csstransforms,

        yep: ['js/turn.js'],

        nope: ['js/turn.html4.min.js'],

        both: ['js/zoom.min.js', 'js/magazine.js', 'css/magazine.css'],

        complete: loadApp

    });

</script>
</body>
</html>

